@charset "utf-8";

// 定义函数 rpx
@function rpx($value) {
  @return $value * 1rpx;
}

/* 选项卡 */

.swiper-tab {
  width: 100%;
  text-align: center;
  height: rpx(80);
  background-color: #fff;
  border-bottom: 1px solid #eee;

  .swiper-tab-item {
    width: 33.333333%;
    height: 100%;
    font-size: rpx(28);
    color: #777;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    border-bottom: 2px solid #ffffff00;
  }

  .on {
    color: #f74c45;
    border-bottom: 2px solid #f74c45;
  }
}

/* 设置scroll-view容器高度 */
.coupon-list, .yoshop-notcont {
  height: 100.1%;
}

/* 评论列表 */

.coupon-list {
  padding: rpx(20);
  box-sizing: border-box;
  .coupon-item {
    position: relative;
    overflow: hidden;
    margin-bottom: rpx(22);
    //box-shadow: 2px 3px 6px #d0d0d0;
    .item-wrapper {
      width: 100%;
      display: flex;
      background: #fff;
      border-radius: rpx(8);
      color: #fff;
      height: rpx(180);

      // 角标
      .coupon-type {
        position: absolute;
        top: 0;
        right: 0;
        z-index: 10;
        width: rpx(128);
        padding: 3px 0;
        background: #a771ff;
        font-size: rpx(20);
        text-align: center;
        color: #ffffff;
        transform: rotate(45deg);
        transform-origin: rpx(64) rpx(64);
      }

      // 蓝色
      &.color__blue {
        background: linear-gradient(-125deg, #57bdbf, #2f9de2);
      }

      // 红色
      &.color__red {
        background: linear-gradient(-128deg, #ff6d6d, #ff3636);
        .coupon-type {
          //background: #ff6c00;
        }
      }

      // 紫色
      &.color__violet {
        background: linear-gradient(-113deg, #ef86ff, #b66ff5);
        .coupon-type {
          background: #55b5ff;
        }
      }

      // 黄色
      &.color__yellow {
        background: linear-gradient(-141deg, #f7d059, #fdb054);
        .coupon-type {
          //background: #ff6262;
        }
      }

      // 灰色
      &.color__gray {
        background: linear-gradient(-113deg, #bdbdbd, #a2a1a2);
        //background: #bdbdbd;
        .coupon-type {
          background: #9e9e9e;
        }
      }
      .content {
        flex: 1;
        padding: rpx(30) rpx(20);
        border-radius: 8px 0 0 8px;

        .title {
          font-size: rpx(38);
        }
      }

      .tip {
        position: relative;
        flex: 0 0 32%;
        text-align: center;
        border-radius: 0 8px 8px 0;

        .money {
          font-weight: bold;
          font-size: rpx(52);
        }

        .pay-line {
          font-size: rpx(22);
        }
      }

      // 中间缺口线
      .split-line {
        position: relative;
        flex: 0 0 0;
        border-left: rpx(4) solid #fff;
        margin: 0 5px 0 3px;
        background: #fff;
      }

      .split-line:before, .split-line:after {
        content: '';
        position: absolute;
        width: 12px;
        height: 6px;
        background: #f7f7f7;
        left: -7px;
        z-index: 1;
      }

      .split-line:before {
        border-radius: 0 0 8px 8px;
        top: 0;
      }

      .split-line:after {
        border-radius: 8px 8px 0 0;
        bottom: 0;
      }

    }
  }

}

/* 没有更多 */

.no-more {
  text-align: center;
  color: #737373;
  padding: 10px 0;
}
